<template>
	<view class="detail">
		<view class="title">
			<text>{{detail.title}}</text>
			<view>
				<text class="create">发表于{{fmDate(detail.create_at)}}</text>
				<uni-icons type="eye" size="20"></uni-icons> {{detail.visit_count}}
				<uni-icons type="chat" size="18"></uni-icons> {{detail.reply_count}}
			</view>
		</view>
		<view class="content contentHtml" v-html="detail.content.replace(/\<img/gi, '<img class=\'rich-img\'')"></view>
	</view>
</template>

<script>
	import {formatDate} from '@/common/utils'
	export default {
		props: ['detail'],
		methods: {
			fmDate (date){
				return formatDate(date)
			}
		}
	}
</script>

<style lang="scss">
	.detail{
		padding: 5px 15px;
		border-bottom: 1px solid #ddd;
		background-color: #fff;
		.title{
			padding-bottom: 5px;
			&>text{
				font-weight: bold;
				font-size: 15px;
				color: #444;
			}
			&>view,
			.uni-icons{
				font-size: 14px;
				color: #999;
			}
			uni-icons,
			.uni-icons,
			uni-icons text{
				color: $baseColor!important;
			}
			.create{
				margin-right: 10px;
			}
		}
		.content{
			padding: 10px 0;
		}
	}
</style>
